<template>
    <div>
        <!--<h2>微信正在登录。。。</h2>-->
        <!--<div class="loader" v-if="code">-->
        <!--<div class="dot"></div>-->
        <!--<div class="dot"></div>-->
        <!--<div class="dot"></div>-->
        <!--<div class="dot"></div>-->
        <!--<div class="dot"></div>-->
        <!--</div>-->
        <!--<div v-else class="login">-->
        <!--<img class="bg-img" src="../../static/loginBg.png">-->
        <!--<div class="center">-->
        <!--<img src="../../static/logo.png"/>-->
        <!--<div class="text">和之初商学院</div>-->
        <!--<button @click="toLogin">点击使用微信号登录</button>-->
        <!--</div>-->
        <!--</div>-->
    </div>
</template>

<script>
    import {getCodeUrl} from '../../api/login'
    import {getBackUrl} from "../../util/auth";
    import {mapActions} from 'vuex'

    export default {
        comments: {},
        created() {
            //如果是开发环境
            this.code = this.$route.query.code
            console.log(this.$route.query)
            //code 存在就返回
            if (this.code) {
                this.login(this.code,1).then(() => {
                    //跳转
                    console.log("登录状态")
                    this.$router.push({
                        path: getBackUrl()
                    })
                })
            } else {
                console.log("线上环境")
                if (process.env.NODE_ENV === 'development') {
                    this.testLogin().then(()=>{
                        console.log(getBackUrl + 'getBackUrl')
                        //跳转
                        this.$router.push({
                            path: getBackUrl()
                        })
                    })
                } else {
                    console.log("toWxAuth")
                    this.toWxAuth()
                }
            }
        },
        data() {
            return {
                code: null
            }
        },
        methods: {
            toWxAuth: function () {
                window.location.href=  getCodeUrl()
            },
            ...mapActions([
                'login', 'testLogin'
            ])
        }
    }
</script>

<style scoped type="text/stylus" lang="stylus">
    .loader
        position absolute
        top 50%
        left 40%
        margin-left 10%
        transform translate3d(-50%, -50%, 0)

    .dot
        width 24px
        height 24px
        background #3ac
        border-radius 100%
        display inline-block
        animation slide 1s infinite

    for n in (1..5)
        .dot:nth-child({n})
            animation-delay (.1s * n)
            background red(#3ac, (50 * n))

    @keyframes slide
        0%
            transform scale(1)
        50%
            opacity .3
            transform scale(2)
        100%
            transform scale(1)

    .login
        position fixed
        top 0
        bottom 0
        left 0
        right 0
        .bg-img
            width 100%
            height 100%
            opacity 0.6
            z-index -999
        .center
            width 100%
            height 100%
            position fixed
            z-index 999
            top 0
            display flex
            flex-direction column
            justify-content flex-start
            align-items center
            img
                width 2.6rem
                height 2.9rem
                margin-top 3rem
            .text
                font-size 0.53rem
                color rgba(255, 255, 255, 1)
                font-weight 500
                margin-top 0.8rem
            button
                margin-top 4.36rem
                width 5.9rem
                height 0.9rem
                border-radius 0.26rem
                background rgba(255, 255, 255, 1)
                font-size .42rem
                line-height 0.9rem
                text-align center
</style>